
import React, {useEffect, useState} from 'react';
import { useParams } from 'umi'
import { dictDataList, dictAdd, dictUpdate, dictDelete, dictInfo } from  '@/services/ant-design-pro/dict';

import ListView from '@/components/Base/ListView'
import Helper from '@/components/Base/helper'

const SysDetpData: React.FC = () => {
  const params = useParams()

  const [info, setInfo] = useState(null)

  const columns = [
    Helper.Table('字典编号', 'id').val,
    Helper.Table('字典标签', 'label').val,
    Helper.Table('字典值', 'value').val,
    Helper.Table('状态', 'status').val,
  ];

  const formColumns = [
    Helper.Form('字典名称', 'dictName')
      .FIP({
        rules: Helper.Rule().Require('不得为空').val,
      }).Width('md').val,
    Helper.Form('字典类型', 'dictCode')
    .FIP({
      rules: Helper.Rule().Require('不得为空').val,
    }).Width('md').val,
    Helper.Form('字典状态', 'status').Radio({0: '正常', 1: '停用'}).Width('md').val,
    Helper.Form('备注', 'remark').Textarea().Width('md').val
  ]

  const values = {
    headerTitle: '字典列表',

    ACTIONS: [
      {type: 'NEW', submit: (id, body) => {
        console.log('ud', id, body)
        if (id) {
          return dictUpdate(id, body)
        }
        return dictAdd(body)
      }, beforeSubmit: (values: any) => ({...values, parentId: values.parentId && values.parentId[0]}) },
      {type: 'EDIT'},
      {type: 'DELETE', submit:(record: {id: number}) => dictDelete(record.id)}
    ],
    columns,
    request: dictDataList,
    formColumns,
    initialValues: {
      parentId: [1],
      dictName: '天神下凡'
    }
  }

  useEffect(() => {
    if (params) {
      dictInfo((params as any).id).then(setInfo)
    }

  }, [params])

  if (!info) {
    return null
  }

  return (
    <ListView {...values} />
  );
};

export default SysDetpData;

